<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- 信息 -->
    <link rel="icon" href="/favicon.ico" type="image/x-icon" />
    <title>其他</title>
    <meta name="author" content="尘跃" />
    <meta
        name="description"
        content="尘跃的个人分享网——其他"
    />

    <!-- style -->
    <link rel="stylesheet" href="/css/style.css">
    <link rel="stylesheet" href="/css/style-fit.css">

    <!-- 百度统计 -->
    <script src="/js/tongji.js"></script>
    <!-- Vue3 -->
    <script src="/js/vue/vue.global.prod.js"></script>
    <!-- Google ADS -->
    <meta name="google-adsense-account" content="ca-pub-7556556693775855">
    <script src="/js/ads.js"></script>

    <style>

        .list {
            display: flex;
            flex-direction: column;
            padding-left: 1em;
        }

        .list > li,
        .list > .list-item,
        .list-item {
            text-align: left;
            font-size: var(--font-size-medium);
        }

        .tip {
            display: block;
            font-size: var(--font-size-medium);
            margin-top: 0.5em;
        }
    </style>
</head>
<body>
    

    <page-header></page-header>


    <div class="block-spacer"></div>
    <main id="main">

        <section>
            <h2>邮箱</h2>
            <span class="tip">申请：</span>
            <div style="display: flex;flex-wrap: wrap;">
                <a class="button" href="mailto:hongweifei@cyue.net?subject=申请邮箱">申请“@cyue.net”邮箱</a>
            </div>
        </section>

        <div class="block-spacer"></div>
        <section>
            <h2>APP</h2>
            <div class="flex-row flex-wrap">
                <a
                    class="button"
                    download="尘跃的个人分享网.apk"
                    ref="androidDownloadAnchor"
                    href="http://android.cyue.net/4.apk"
                >
                    下载安卓APP
                </a>
            </div>
        </section>


        <div class="block-spacer"></div>
        <section>
            <h2>Dialog</h2>
            <span class="tip">效果测试：</span>
            <div>
                <ul class="list">
                    <li><a href="#" onclick="Dialog.popup('popup')">popup</a></li>
                    <li>
                        <span style="font-size: var(--font-size-medium);">tip：</span>
                        <ul class="list">
                            <li><a href="#" onclick="Dialog.tip('成功', 'success')">tip（成功）</a></li>
                            <li><a href="#" onclick="Dialog.tip('错误', 'error')">tip（错误）</a></li>
                            <li><a href="#" onclick="Dialog.tip('警告', 'warning')">tip（警告）</a></li>
                        </ul>
                    </li>
                    <li><a href="#" onclick="Dialog.window('a window')">window</a></li>
                </ul>
            </div>

            <span class="tip">下载使用：</span>
            <div style="display: flex;flex-wrap: wrap;">
                <a class="button" download="dialog.js" href="/js/dialog.js">下载dialog.js</a>
            </div>
        </section>

        <!-- <div class="block-spacer"></div>
        <section>
            <h2>yuzu</h2>
            <span class="tip">在线的房间：</span>
            <div>
                <ul class="list">
                    <li v-for="item in yuzuServerList">
                        <a href="#">{{ item }}</a>
                    </li>
                </ul>
            </div>
        </section> -->

        <!-- <div class="block-spacer"></div>
        <section>
            <h2>Minecraft</h2>
            <span class="tip">运行中的服务器：</span>
            <div>
                <ul class="list">
                    <li v-for="item in minecraftServerList">
                        <a
                            href="#"
                            :data-address="item.address"
                            :data-support_ipv="item.support_ipv"
                            @click="showMinecraftJavaServerStatus"
                        >
                            {{ item.address }}
                        </a>
                    </li>
                </ul>
            </div>
            
            <span class="tip">申请：</span>
            <div style="display: flex;flex-wrap: wrap;">
                <a class="button" href="mailto:hongweifei@cyue.net?subject=申请“尘跃的生存服”进入权限">申请“尘跃的生存服”进入权限</a>
            </div>
        </section> -->

    </main>

    
    <page-footer></page-footer>

    <!-- web component -->
    <script src="/js/component.js"></script>
    <!-- style -->
    <script src="/js/style.js"></script>

    <script src="/js/http.js"></script>
    <script src="/js/dialog.js"></script>
    <!-- <script src="/js/android.js"></script> -->
    <script>
        const { createApp } = Vue;
        createApp({

            mounted() {
                const that = this;

                HTTP.request({
                    method: "GET",
                    url: "/api/android/version"
                }).then(response => {
                    const result = response.data;
                    const versionInfo = result.data;
                    const versionCode = versionInfo.version[versionInfo.newestVersion];
                    const downloadURL = `http://android.cyue.net/${versionCode}.apk`;
                    this.$refs.androidDownloadAnchor.href = downloadURL;

                    const androidScript = document.createElement("script");
                    androidScript.src = "/js/android.js";
                    document.body.appendChild(androidScript);
                });

                // yuzu
                // HTTP.request({
                //     method: "GET",
                //     url: "/api/other/yuzu/server/list"
                // }).then(response => {
                //     const result = response.data;
                //     that.yuzuServerList = result.data;
                // });

                // HTTP.request({
                //     method: "GET",
                //     url: "/api/other/minecraft/server/list"
                // }).then(response => {
                //     const result = response.data;
                //     that.minecraftServerList = result.data;
                // });
            },

            data() {
                return {
                    // yuzuServerList: [],
                    // minecraftServerList: []
                };
            },

            methods: {

                // showMinecraftJavaServerStatus(e)
                // {
                //     const address = e.target.dataset.address;
                //     const support_ipv = e.target.dataset.support_ipv;
                //     if (!support_ipv.includes("ipv4") && !support_ipv.includes("4"))
                //     {
                //         Dialog.popup("网站服务器不支持IPV6");
                //         return;
                //     }

                //     HTTP.request({
                //         method: "GET",
                //         url: `/api/tool/minecraft/ping/java/${address}`
                //     })
                //     .then(res => {
                //         const result = res.data;

                //         if (result.message)
                //             Dialog.popup(result.message);
                //         if (result.type === "failed")
                //             return;
                        

                //         const info = result.data;
                //         const version = info.version.name;
                //         const description = info.description.text ? info.description.text : info.description;
                //         const online = info.players.online;
                //         const max = info.players.max;

                //         const div = document.createElement("div");
                //         div.style.boxSizing = "border-box";
                //         div.style.padding = "0.5em";
                //         div.style.fontSize = "medium";
                //         div.style.width = "10rem";
                //         // div.style.height = "8rem";

                //         div.style.display = "flex";
                //         div.style.flexDirection = "column";
                //         div.style.gap = "5px";

                //         div.innerHTML = `
                //             ${description}<br/>
                //             版本：${version}<br/>
                //             在线人数：${online}<br/>
                //             最大人数：${max}<br/>
                //         `;
                //         Dialog.window(div);
                //     })
                //     .catch(e => {
                //         Dialog.popup("服务不可用");
                //     });
                // },

            }
        }).mount("#main");

    </script>
</body>
</html>




